hls.js에서 에러 이벤트(error handling)를 처리하는 방법은?

Last Modified : 2017-04-25 / Created : 2017-04-25

26,543
View Count

주소 복사하기

hls.js를 사용하는 경우 발생하는 에러 이벤트를 처리, 핸들링 하기 위하여 아래와 같이 에러 이벤트를 등록할 수 있습니다.

# HLS 에러 이벤트 처리 방법

만약 생성한 인스턴스의 이름이 hlsVideo인 경우 아래와 같이 에러를 발생합니다.

hlsVideo.on(Hls.Events.ERROR, function(event, data) {
  var errorType = data.type;
  var errorDetails = data.details;
  var errorFatal = data.fatal;

  throw new Error('Error occued! ErrorType, Details: ' + errorType + ', ' + errorDetails);
});

예제에서는 브라우저에 이벤트를 호출하도록 동작시켰습니다.

# HLS 비디오 에러 처리시 주의할 점

HLS.js를 사용하여 라이브 재생시 에러처리에 신중해야 합니다. 그 이유 중 하나로 네트워크 에러에 따른 비디오 재생 불가 이슈가 있습니다. 만약 HLS의 에러 발생시 비디오 재생을 불가하도록 바꾸었는데 나중에 네트워크가 정상으로 돌아올 경우 ~ 문제가 생길 수 있습니다.

이 경우 해결할 수 있는 방법으로 쉽게 두 가지를 생각해 볼 수 있습니다.

i. HLS FlagTimeout이 발생하는 경우의 config를 수정하기
; config 설정으로 Timeout이 발생하는 시간을 아래와 같이 길게 설정합니다.

var config = {
    fragLoadingTimeOut: 30000,
    fragLoadingMaxRetry: 10,
    fragLoadingMaxRetryTimeout: 100000
}

ii. HLS error가 발생해도 Play에는 영향을 주지 않도록 코드 작성

후자의 경우 간편하지만 발생하는 Error 타입은 timeout만이 아니므로 가급적 전자의 방법이 좋을 것 입니다.

아래의 글도 찾고 계시지 않나요?

자바스크립트 원하는 소수점까지만 계산하여 보여주는 방법은?

Javascript에서 문자를 base64로 인코딩, 변환하는 방법은?